home *** CD-ROM | disk | FTP | other *** search
/ Amiga Format CD 12 / Amiga Format AFCD12 (Apr 1997, Issue 96).iso / -in_the_mag- / html_tutorial / make.sh < prev    next >
Text File  |  1997-01-21  |  13KB  |  560 lines
  1. cat << +END+ > head
  2. <!doctype html public "-//IETF//DTD HTML//EN">
  3.  
  4. <HTML>
  5.  
  6. <HEAD>
  7. <TITLE>A introduction to HTML and CGI scripts on the WWW</TITLE>
  8. <LINK TITLE="HTML WWW CGI web guide interactive introduction use example"
  9.       HREF="mailto:M.A.Smith@brighton.ac.uk" >
  10. </HEAD>
  11.  
  12. <!-- -------------------------------------------------- -->
  13.  
  14. <BODY BACKGROUND="pic/backgrd.jpg">
  15.  
  16. <BANNER>
  17. <CENTER>
  18. <TABLE ID="Banner" BORDER CELLPADDING=2>
  19.  <TD ALIGN=LEFT> <IMG SRC="pic/dot.gif" ALT="*"  ALIGN="TOP"> </A></TD>
  20.  <TD ALIGN=LEFT> 
  21.   <A HREF="html.htm"> [A guide to HTML and CGI scripts]</A> 
  22.  </TD>
  23.  <TD ALIGN=LEFT> <IMG SRC="pic/dot.gif" ALT="*"  ALIGN="TOP"> </A></TD>
  24. </TABLE>
  25. </CENTER>
  26. </BANNER>
  27. <P>
  28. <FONT SIZE=+3>I</FONT>f you wish, 
  29. you can modify the HTML tags and text in the window to
  30. try out your own ideas.
  31.  
  32. By pressing view, the text in the window will be sent back to your browser
  33. to be displayed. <I>Use the back button on your browser to return to
  34. the original document.</I>
  35. <P>
  36. This before text allows you to see the effect of the HTML in context.
  37.  
  38. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_try">
  39.  <TEXTAREA NAME="feedback" ROWS=12 COLS=75>
  40. +END+
  41.  
  42. cat << +END+ > tail
  43.  </TEXTAREA>
  44.  <P>
  45.  This after text allows you to see the effect of the HTML in context.
  46.  <P>
  47.  <INPUT TYPE="submit" NAME="button" VALUE="View"> the processed HTML.
  48.  
  49. </FORM>
  50.  
  51.  
  52. <HR>
  53. The material in these WWW page(s) is copyright © M.A.Smith October 1995<BR>
  54. Last modified 14 February 1996
  55. <ADDRESS>
  56. Comments, suggestions, etc. 
  57. <A HREF="mailto:M.A.Smith@brighton.ac.uk">
  58. M.A.Smith@brighton.ac.uk
  59. </A>
  60. </ADDRESS>
  61.  
  62. </BODY>
  63.  
  64. </HTML>
  65. +END+
  66.  
  67.  
  68. cat head > try_ex.htm
  69. cat << +END+ >> try_ex.htm
  70. <P>
  71. Creating a document using HTML is just like using a 
  72. very old word processor.
  73. <P>
  74. +END+
  75. cat tail >> try_ex.htm
  76.  
  77.  
  78. cat head > try_bd.htm
  79. cat << +END+ >> try_bd.htm
  80. The <B>text</B> is bolded.
  81. The <TT>text</TT> is in a teletype font.
  82. The <FONT SIZE=+2>text</FONT> is 2 sizes larger.
  83. +END+
  84. cat tail >> try_bd.htm
  85.  
  86. cat head > try_pg.htm
  87. cat << +END+ >> try_pg.htm
  88. Last sentence of a paragraph
  89. <P>
  90. The first line of a new paragraph.
  91. A line of text
  92. <BR>
  93. On a new line;
  94. +END+
  95. cat tail >> try_pg.htm
  96.  
  97. cat head > try_dl.htm
  98. cat << +END+ >> try_dl.htm
  99. <DL>
  100.  <DT>
  101.  Definition tag.
  102.  <DD>
  103.  Text of the definition list.
  104.  Which may stretch over several
  105.  lines.
  106.  <DT>
  107.  Another definition tag.
  108.  <DD>
  109.  Text of the definition list.
  110. </DL>
  111. +END+
  112. cat tail >> try_dl.htm
  113.  
  114. cat head > try_h6.htm
  115. cat << +END+ >> try_h6.htm
  116. <H6>A TITLE</H6>
  117. +END+
  118. cat tail >> try_h6.htm
  119.  
  120. cat head > try_hr.htm
  121. cat << +END+ >> try_hr.htm
  122. The size of the ruler<HR SIZE=10>New section
  123. +END+
  124. cat tail >> try_hr.htm
  125.  
  126. cat head > try_mas.htm
  127. cat << +END+ >> try_mas.htm
  128. Tue Aug 29 19:46:53 1995 test      []                  []                  
  129. Tue Aug 29 19:49:10 1995 ~m/test   []                  []                  
  130. +END+
  131. cat tail >> try_mas.htm
  132.  
  133. cat head > try_ol.htm
  134. cat << +END+ >> try_ol.htm
  135. <OL>
  136. <LI>Item one of list
  137. <LI>Item two of list
  138. </OL>
  139. +END+
  140. cat tail >> try_ol.htm
  141.  
  142.  
  143. cat head > try_pre.htm
  144. cat << +END+ >> try_pre.htm
  145. <PRE>
  146.    *
  147.   *<B>*</B>*
  148.  *****
  149. </PRE>
  150. +END+
  151. cat tail >> try_pre.htm
  152.  
  153. cat head > try_ul.htm
  154. cat << +END+ >> try_ul.htm
  155. <UL>
  156. <LI>Item one of list
  157. <LI>Item two of list
  158. </UL>
  159. +END+
  160. cat tail >> try_ul.htm
  161.  
  162. cat head > try_tab1.htm
  163. cat << +END+ >> try_tab1.htm
  164. <TABLE BORDER CELLPADDING=2>
  165. <TD>
  166.  Text in a table
  167. </TD>
  168. </TABLE>
  169. +END+
  170. cat tail >> try_tab1.htm
  171.  
  172. cat head > try_tab2.htm
  173. cat << +END+ >> try_tab2.htm
  174. <TABLE BORDER CELLPADDING=2>
  175.  <TD> Data cell 1 </TD>
  176.  <TD> Data cell 2 </TD>
  177. </TABLE>
  178. +END+
  179. cat tail >> try_tab2.htm
  180.  
  181. cat head > try_tab3.htm
  182. cat << +END+ >> try_tab3.htm
  183. <TABLE BORDER CELLPADDING=2>
  184.  <TD> Data cell 1 </TD>
  185.  <TD> Data cell 2 </TD>
  186. <TR>
  187.  <TD> Data cell 3 </TD>
  188.  <TD> Data cell 4 </TD>
  189. </TABLE>
  190. +END+
  191. cat tail >> try_tab3.htm
  192.  
  193. cat head > try_tab4.htm
  194. cat << +END+ >> try_tab4.htm
  195. <TABLE BORDER CELLPADDING=2>
  196.  <TH ALIGN=LEFT>Language</TH>
  197.  <TH ALIGN=LEFT COLSPAN=2>Encapsulation</TH>
  198. <TR>
  199.  <TD> Ada 95</TD>
  200.  <TD ROWSPAN=2>Using</TD>
  201.  <TD> Class</TD>
  202. <TR>
  203.  <TD> C++</TD>
  204.  <TD> Package</TD>
  205. </TABLE>
  206. +END+
  207. cat tail >> try_tab4.htm
  208.  
  209. cat head > try_pl.htm
  210. cat << +END+ >> try_pl.htm
  211. The browser will ignore
  212. new lines and extra
  213. spaces in the text.
  214. +END+
  215. cat tail >> try_pl.htm
  216.  
  217. cat head > try_for1.htm
  218. cat << +END+ >> try_for1.htm
  219. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  220. <INPUT TYPE="text" NAME="name"
  221.        SIZE=20 VALUE="Your name">
  222. </FORM>
  223. +END+
  224. cat tail >> try_for1.htm
  225.  
  226. cat head > try_for2.htm
  227. cat << +END+ >> try_for2.htm
  228. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  229. Enter PIN Number<BR>
  230. <INPUT TYPE="password" NAME="PIN"
  231.        SIZE=20 VALUE="">
  232. </FORM>
  233. +END+
  234. cat tail >> try_for2.htm
  235.  
  236. cat head > try_for3.htm
  237. cat << +END+ >> try_for3.htm
  238. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  239. <TEXTAREA NAME="feedback" ROWS=5 COLS=20>
  240. My thoughts so far are:
  241. </TEXTAREA>
  242. <BR>
  243. <INPUT TYPE="submit" NAME="button" 
  244.        VALUE="Send">
  245. </FORM>
  246. +END+
  247. cat tail >> try_for3.htm
  248.  
  249. cat head > try_for4.htm
  250. cat << +END+ >> try_for4.htm
  251. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  252. Age<BR>
  253. <INPUT TYPE="radio" NAME="age" VALUE="a"><18<BR>
  254. <INPUT TYPE="radio" NAME="age" VALUE="b" 
  255.        CHECKED>18-65<BR>
  256. <INPUT TYPE="radio" NAME="age" VALUE="c">65+<BR>
  257. <INPUT TYPE="submit" NAME="button" VALUE="Send">
  258. </FORM>
  259. +END+
  260. cat tail >> try_for4.htm
  261.  
  262. cat head > try_for5.htm
  263. cat << +END+ >> try_for5.htm
  264. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  265. Use<BR>
  266. <INPUT TYPE="checkbox" NAME="use"
  267.        VALUE="C++" CHECKED>C++<BR>
  268. <INPUT TYPE="checkbox" NAME="use"
  269.        VALUE="Ada">Ada<BR>
  270. <INPUT TYPE="checkbox" NAME="use"
  271.        VALUE="COBOL">COBOL<BR>
  272. <INPUT TYPE="submit" NAME="button"
  273.        VALUE="send">
  274. </FORM>
  275. +END+
  276. cat tail >> try_for5.htm
  277.  
  278. cat head > try_for6.htm
  279. cat << +END+ >> try_for6.htm
  280. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  281. Media used is<BR>
  282. <SELECT NAME="Media">
  283.         <OPTION SELECTED> Disk
  284.         <OPTION> Floppy disk
  285.         <OPTION> DAT tape
  286. </SELECT>
  287. <BR>
  288. <INPUT TYPE="submit" NAME="button"
  289.        VALUE="Send">
  290. </FORM>
  291. +END+
  292. cat tail >> try_for6.htm
  293.  
  294. cat head > try_for7.htm
  295. cat << +END+ >> try_for7.htm
  296. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  297. Drinks that I like<BR>
  298. <INPUT TYPE="checkbox" NAME="Like"
  299.        VALUE="Coffee" >Coffee<BR>
  300. <INPUT TYPE="checkbox" NAME="Like"
  301.        VALUE="Tea">Tea<BR>
  302. <INPUT TYPE="reset" VALUE="Reset">
  303. <INPUT TYPE="submit" NAME="button"
  304.        VALUE="Send">
  305. </FORM>
  306. +END+
  307. cat tail >> try_for7.htm
  308.  
  309. cat head > try_for8.htm
  310. cat << +END+ >> try_for8.htm
  311. Select a point<BR>
  312. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  313. <INPUT NAME="image" TYPE="IMAGE"
  314.        SRC="http://snowwhite.it.brighton.ac.uk/~mas/mas/pic/mas_fn50.jpg"
  315.        ALIGN=TOP>
  316. </FORM>
  317. +END+
  318. cat tail >> try_for8.htm
  319.  
  320. cat head > try_for9.htm
  321. cat << +END+ >> try_for9.htm
  322.  <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  323.  Enter next move<BR>
  324.  <INPUT TYPE="hidden" NAME="game" VALUE="P123456">
  325.  <INPUT TYPE="text" NAME="move" SIZE=2>
  326.  </FORM>
  327. +END+
  328. cat tail >> try_for9.htm
  329.  
  330. cat head > try_log.htm
  331. cat << +END+ >> try_log.htm
  332. The following <CITE>citation</CITE>is taken from
  333. a book.
  334. +END+
  335. cat tail >> try_log.htm
  336.  
  337. cat head > try_img.htm
  338. cat << +END+ >> try_img.htm
  339. <IMG SRC="http://snowwhite.it.brighton.ac.uk/~mas/mas/pic/mas_fn50.jpg" 
  340.      ALT="mas" ALIGN=TOP>jpeg image.
  341. <BR>
  342. A gif image 
  343. <IMG SRC="http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/pic/sdot.gif"
  344.      ALIGN=TOP>
  345. with a transparent background
  346. +END+
  347. cat tail >> try_img.htm
  348.  
  349. cat head > try_pgt.htm
  350. cat << +END+ >> try_pgt.htm
  351. <FORM METHOD="post" 
  352.       ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  353. <INPUT TYPE="text" NAME="name"
  354.        SIZE=20 VALUE="Try it (post)">
  355. </FORM>
  356. +END+
  357. cat tail >> try_pgt.htm
  358.  
  359. cat head > try_but.htm
  360. cat << +END+ >> try_but.htm
  361. <FORM ACTION="http://snowwhite.it.brighton.ac.uk/cgi-bin/mas/mas_form">
  362. <INPUT TYPE="submit" NAME="button" VALUE=" A ">
  363. <INPUT TYPE="submit" NAME="button" VALUE=" B ">
  364. </FORM>
  365. +END+
  366. cat tail >> try_but.htm
  367.  
  368.  
  369. cat head > try_anc.htm
  370. cat << +END+ >> try_anc.htm
  371. The following hyper text link will take you to the 
  372. document
  373. <A HREF="http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/try_m1.htm">
  374. Hyper text link to try_m1.htm
  375. </A>
  376. <P>
  377. There is also a document named try_m2.
  378. +END+
  379. cat tail >> try_anc.htm
  380.  
  381. rm try_m1.htm
  382. : cat head > try_m1.htm
  383. cat << +END+ >> try_m1.htm
  384. <H1>The document try_m1.htm</H1>
  385. Go <A HREF="try_anc.htm"> back </A>
  386. to the try it document about anchors
  387. <P>
  388. Use the back button on your browser to return to
  389. the original document.
  390. <P>
  391. +END+
  392. : cat tail >> try_m1.htm
  393.  
  394.  
  395. rm try_m2.htm
  396. : cat head > try_m2.htm
  397. cat << +END+ >> try_m2.htm
  398. <H1>The document try_m2.htm</H1>
  399. Go <A HREF="try_anc.htm"> back </A>
  400. to the try it document about anchors
  401. <P>
  402. Use the back button on your browser to return to
  403. the original document.
  404. <P>
  405. +END+
  406. : cat tail >> try_m2.htm
  407.  
  408.  
  409. rm try_col0.htm
  410. cat head > try_col0.htm
  411. cat << +END+ >> try_col0.htm
  412. <P>
  413. The text is now in the colour
  414. <FONT COLOR="yellow">Yellow </FONT>
  415. +END+
  416. cat tail >> try_col0.htm 
  417.  
  418. rm try_col1.htm
  419. cat head > try_col1.htm
  420. cat << +END+ >> try_col1.htm
  421. <P>
  422. The text is now in the colour
  423. <FONT COLOR="#FFFF00">Yellow </FONT>
  424. +END+
  425. cat tail >> try_col1.htm 
  426.  
  427. rm try_run.htm
  428. cat head > try_run.htm
  429. cat << +END+ >> try_run.htm
  430. <P>
  431. This should run a CGI script in a user home directory.
  432. <P>
  433. <A HREF="http://snowwhite.it.bton.ac.uk/cgi-bin/bsc_run?user=mas&file=test">
  434. Execute CGI script
  435. </A>
  436. <P>
  437. +END+
  438. cat tail >> try_run.htm 
  439.  
  440. cat << +END+ > sed.jcl
  441. /feedback/s/</<INPUT TYPE="hidden" NAME="nowrap" VALUE="y"> </
  442. /This after text allows/d
  443. /This before text allows/d
  444. +END+
  445.  
  446. rm try_col2.htm
  447. : cat head > try_col2.htm
  448. sed -f sed.jcl < head >try_col2.htm
  449. cat << +END+ >> try_col2.htm
  450. <HTML>
  451. <P>
  452. <BODY BGCOLOR="#00FF00" TEXT="red" LINK="#0000FF">
  453.  This is normal text which is in the body of an HTML page.
  454.  <UL>
  455.   <LI>
  456.    <A HREF=
  457.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/try_col2.htm">
  458.        Example link 
  459.    </A>
  460.   <LI>
  461.    <A HREF=
  462.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/try_col2.htm">
  463.        Example link 
  464.    </A>
  465.  </UL>
  466. </BODY>
  467. </HTML>
  468. +END+
  469. sed -f sed.jcl < tail >> try_col2.htm
  470. : cat tail >> try_col2.htm 
  471.  
  472.  
  473. rm try_fr01.htm
  474. : cat head > try_fr01.htm
  475. sed -f sed.jcl < head > try_fr01.htm
  476. cat << +END+ >> try_fr01.htm
  477. <HTML>
  478.  <FRAMESET COLS="30%,70%">
  479.   <NOFRAMES>Sorry does not support frames</NOFRAMES>
  480.   <FRAME SRC=
  481.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt1.htm">
  482.   <FRAME SRC=
  483.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt2.htm"
  484.        NAME="results" >
  485.  </FRAMESET>
  486. </HTML>
  487. +END+
  488. sed -f sed.jcl < tail >> try_fr01.htm
  489. : cat tail >> try_fr01.htm 
  490.  
  491. rm try_fr02.htm
  492. : cat head > try_fr02.htm
  493. sed -f sed.jcl < head > try_fr02.htm
  494. cat << +END+ >> try_fr02.htm
  495. <HTML>
  496.  <FRAMESET ROWS="30%,30%,40%">
  497.   <NOFRAMES>Sorry does not support frames</NOFRAMES>
  498.   <FRAME SRC=
  499.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt1.htm">
  500.   <FRAME SRC=
  501.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt2.htm">
  502.   <FRAME SRC=
  503.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt3.htm">
  504.  </FRAMESET>
  505. </HTML>
  506. +END+
  507. sed -f sed.jcl < tail >> try_fr02.htm
  508.  
  509.  
  510. rm try_fr03.htm
  511. : cat head > try_fr03.htm
  512. sed -f sed.jcl < head > try_fr03.htm
  513. cat << +END+ >> try_fr03.htm
  514. <HTML>
  515.  <HEAD>
  516.   <TITLE>Page with frames</TITLE>
  517.  </HEAD>
  518.  <FRAMESET COLS="50%,50%">
  519.    <NOFRAMES>Sorry does not support frames</NOFRAMES>
  520.    <FRAMESET ROWS="50%,50%%">
  521.      <FRAME SRC=
  522.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt1.htm">
  523.      <FRAME SRC=
  524.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt1.htm">
  525.    </FRAMESET>
  526.    <FRAMESET ROWS="40%,20%,40%">
  527.      <FRAME SRC=
  528.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt1.htm">
  529.      <FRAME SRC=
  530.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt2.htm">
  531.      <FRAME SRC=
  532.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt3.htm">
  533.    </FRAMESET>
  534.  </FRAMESET>
  535. </HTML>
  536. +END+
  537. sed -f sed.jcl < tail >> try_fr03.htm
  538. : cat tail >> try_fr01.htm 
  539.  
  540.  
  541. rm try_fr10.htm
  542. : cat head > try_fr10.htm
  543. sed -f sed.jcl < head > try_fr10.htm
  544. cat << +END+ >> try_fr10.htm
  545. <HTML>
  546.  <FRAMESET COLS="30%,70%">
  547.   <FRAME SRC=
  548.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt11.htm">
  549.   <FRAME SRC=
  550.        "http://snowwhite.it.brighton.ac.uk/~mas/mas/courses/html/fr-txt12.htm" NAME="results">
  551.  </FRAMESET>
  552. </HTML>
  553. +END+
  554. sed -f sed.jcl < tail >> try_fr10.htm
  555. : cat tail >> try_fr10.htm 
  556.  
  557.  
  558. rm -f head tail sed.jcl
  559.  
  560.